<template>
  <div id="zc">
    <div id="zc-header">
      <div id="zc-header-l">
        <span @click="mixins">&lt;</span>
      </div>
      <div id="zc-header-r">
        <h3>注册</h3>
      </div>
    </div>
    <div id="zc-1">
      <img src="	https://www.chawo.com/wap/static/logo-font.png" />
    </div>
    <div id="zc-2">
      <div id="zc-2-1">
        <input type="text" placeholder="手机号" />
      </div>
      <div id="zc-2-1">
        <input type="text" placeholder="验证码" />
        <span>获取验证码</span>
      </div>
    </div>
    <div id="anniu">
      <button>提交</button>
    </div>
  </div>
</template>

<script>
import methodmixins from "@/mixins/index.js";
export default {
  mixins: [methodmixins],
};
</script>

<style>
#zc {
  width: 100%;
}
#zc-header {
  width: 100%;
  height: 0.4rem;
  line-height: 0.4rem;
  /* background-color: pink; */
  display: flex;
  border-bottom: 0.01rem solid gainsboro;
}
#zc-header-l {
  font-size: 0.25rem;
  color: gray;
  padding-left: 0.25rem;
  width: 10%;
}
#zc-header-r {
  width: 90%;
  font-size: 0.18rem;
  text-align: center;
}
#zc-1 {
  margin: 70px auto;
  text-align: center;
}
#zc-1 img {
  width: 0.97rem rem;
  height: 0.29rem;
}
#zc-2 {
  margin-top: 0.4rem;
  text-align: left;
  padding: 0.35rem 0.25rem 0.25rem;
}
#zc-2-1 {
  border-bottom: 0.5px solid #ccc;
  margin-bottom: 0.25rem;
}
#zc-2-1 input {
  margin: 0.03rem 0;
  font-size: 0.18rem;
}
#zc-2-1 span {
  color: blue;
}
#anniu {
  text-align: center;
}
#anniu button {
  background-color: cornflowerblue;
  color: #fff;
  border: none;
  font-size: 15px;
  margin: 6px 0;
  border-radius: 30px;
  width: 3.25rem;
  height: 0.39rem;
}
</style>